yuncms /
framework
| Conditions | 1 |
| Paths | 0 |
| Total Lines | 718 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 0 | ||
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | /*! |
||
| 35 | }( function( $ ) { |
||
| 36 | |||
| 37 | return $.widget( "ui.slider", $.ui.mouse, { |
||
| 38 | version: "1.12.1", |
||
| 39 | widgetEventPrefix: "slide", |
||
| 40 | |||
| 41 | options: { |
||
| 42 | animate: false, |
||
| 43 | classes: { |
||
| 44 | "ui-slider": "ui-corner-all", |
||
| 45 | "ui-slider-handle": "ui-corner-all", |
||
| 46 | |||
| 47 | // Note: ui-widget-header isn't the most fittingly semantic framework class for this |
||
| 48 | // element, but worked best visually with a variety of themes |
||
| 49 | "ui-slider-range": "ui-corner-all ui-widget-header" |
||
| 50 | }, |
||
| 51 | distance: 0, |
||
| 52 | max: 100, |
||
| 53 | min: 0, |
||
| 54 | orientation: "horizontal", |
||
| 55 | range: false, |
||
| 56 | step: 1, |
||
| 57 | value: 0, |
||
| 58 | values: null, |
||
| 59 | |||
| 60 | // Callbacks |
||
| 61 | change: null, |
||
| 62 | slide: null, |
||
| 63 | start: null, |
||
| 64 | stop: null |
||
| 65 | }, |
||
| 66 | |||
| 67 | // Number of pages in a slider |
||
| 68 | // (how many times can you page up/down to go through the whole range) |
||
| 69 | numPages: 5, |
||
| 70 | |||
| 71 | _create: function() { |
||
| 72 | this._keySliding = false; |
||
| 73 | this._mouseSliding = false; |
||
| 74 | this._animateOff = true; |
||
| 75 | this._handleIndex = null; |
||
| 76 | this._detectOrientation(); |
||
| 77 | this._mouseInit(); |
||
| 78 | this._calculateNewMax(); |
||
| 79 | |||
| 80 | this._addClass( "ui-slider ui-slider-" + this.orientation, |
||
| 81 | "ui-widget ui-widget-content" ); |
||
| 82 | |||
| 83 | this._refresh(); |
||
| 84 | |||
| 85 | this._animateOff = false; |
||
| 86 | }, |
||
| 87 | |||
| 88 | _refresh: function() { |
||
| 89 | this._createRange(); |
||
| 90 | this._createHandles(); |
||
| 91 | this._setupEvents(); |
||
| 92 | this._refreshValue(); |
||
| 93 | }, |
||
| 94 | |||
| 95 | _createHandles: function() { |
||
| 96 | var i, handleCount, |
||
| 97 | options = this.options, |
||
| 98 | existingHandles = this.element.find( ".ui-slider-handle" ), |
||
| 99 | handle = "<span tabindex='0'></span>", |
||
| 100 | handles = []; |
||
| 101 | |||
| 102 | handleCount = ( options.values && options.values.length ) || 1; |
||
| 103 | |||
| 104 | if ( existingHandles.length > handleCount ) { |
||
| 105 | existingHandles.slice( handleCount ).remove(); |
||
| 106 | existingHandles = existingHandles.slice( 0, handleCount ); |
||
| 107 | } |
||
| 108 | |||
| 109 | for ( i = existingHandles.length; i < handleCount; i++ ) { |
||
| 110 | handles.push( handle ); |
||
| 111 | } |
||
| 112 | |||
| 113 | this.handles = existingHandles.add( $( handles.join( "" ) ).appendTo( this.element ) ); |
||
| 114 | |||
| 115 | this._addClass( this.handles, "ui-slider-handle", "ui-state-default" ); |
||
| 116 | |||
| 117 | this.handle = this.handles.eq( 0 ); |
||
| 118 | |||
| 119 | this.handles.each( function( i ) { |
||
| 120 | $( this ) |
||
| 121 | .data( "ui-slider-handle-index", i ) |
||
| 122 | .attr( "tabIndex", 0 ); |
||
| 123 | } ); |
||
| 124 | }, |
||
| 125 | |||
| 126 | _createRange: function() { |
||
| 127 | var options = this.options; |
||
| 128 | |||
| 129 | if ( options.range ) { |
||
| 130 | if ( options.range === true ) { |
||
| 131 | if ( !options.values ) { |
||
| 132 | options.values = [ this._valueMin(), this._valueMin() ]; |
||
| 133 | } else if ( options.values.length && options.values.length !== 2 ) { |
||
| 134 | options.values = [ options.values[ 0 ], options.values[ 0 ] ]; |
||
| 135 | } else if ( $.isArray( options.values ) ) { |
||
| 136 | options.values = options.values.slice( 0 ); |
||
| 137 | } |
||
| 138 | } |
||
| 139 | |||
| 140 | if ( !this.range || !this.range.length ) { |
||
| 141 | this.range = $( "<div>" ) |
||
| 142 | .appendTo( this.element ); |
||
| 143 | |||
| 144 | this._addClass( this.range, "ui-slider-range" ); |
||
| 145 | } else { |
||
| 146 | this._removeClass( this.range, "ui-slider-range-min ui-slider-range-max" ); |
||
| 147 | |||
| 148 | // Handle range switching from true to min/max |
||
| 149 | this.range.css( { |
||
| 150 | "left": "", |
||
| 151 | "bottom": "" |
||
| 152 | } ); |
||
| 153 | } |
||
| 154 | if ( options.range === "min" || options.range === "max" ) { |
||
| 155 | this._addClass( this.range, "ui-slider-range-" + options.range ); |
||
| 156 | } |
||
| 157 | } else { |
||
| 158 | if ( this.range ) { |
||
| 159 | this.range.remove(); |
||
| 160 | } |
||
| 161 | this.range = null; |
||
| 162 | } |
||
| 163 | }, |
||
| 164 | |||
| 165 | _setupEvents: function() { |
||
| 166 | this._off( this.handles ); |
||
| 167 | this._on( this.handles, this._handleEvents ); |
||
| 168 | this._hoverable( this.handles ); |
||
| 169 | this._focusable( this.handles ); |
||
| 170 | }, |
||
| 171 | |||
| 172 | _destroy: function() { |
||
| 173 | this.handles.remove(); |
||
| 174 | if ( this.range ) { |
||
| 175 | this.range.remove(); |
||
| 176 | } |
||
| 177 | |||
| 178 | this._mouseDestroy(); |
||
| 179 | }, |
||
| 180 | |||
| 181 | _mouseCapture: function( event ) { |
||
| 182 | var position, normValue, distance, closestHandle, index, allowed, offset, mouseOverHandle, |
||
| 183 | that = this, |
||
| 184 | o = this.options; |
||
| 185 | |||
| 186 | if ( o.disabled ) { |
||
| 187 | return false; |
||
| 188 | } |
||
| 189 | |||
| 190 | this.elementSize = { |
||
| 191 | width: this.element.outerWidth(), |
||
| 192 | height: this.element.outerHeight() |
||
| 193 | }; |
||
| 194 | this.elementOffset = this.element.offset(); |
||
| 195 | |||
| 196 | position = { x: event.pageX, y: event.pageY }; |
||
| 197 | normValue = this._normValueFromMouse( position ); |
||
| 198 | distance = this._valueMax() - this._valueMin() + 1; |
||
| 199 | this.handles.each( function( i ) { |
||
| 200 | var thisDistance = Math.abs( normValue - that.values( i ) ); |
||
| 201 | if ( ( distance > thisDistance ) || |
||
| 202 | ( distance === thisDistance && |
||
| 203 | ( i === that._lastChangedValue || that.values( i ) === o.min ) ) ) { |
||
| 204 | distance = thisDistance; |
||
| 205 | closestHandle = $( this ); |
||
| 206 | index = i; |
||
| 207 | } |
||
| 208 | } ); |
||
| 209 | |||
| 210 | allowed = this._start( event, index ); |
||
| 211 | if ( allowed === false ) { |
||
| 212 | return false; |
||
| 213 | } |
||
| 214 | this._mouseSliding = true; |
||
| 215 | |||
| 216 | this._handleIndex = index; |
||
| 217 | |||
| 218 | this._addClass( closestHandle, null, "ui-state-active" ); |
||
| 219 | closestHandle.trigger( "focus" ); |
||
| 220 | |||
| 221 | offset = closestHandle.offset(); |
||
| 222 | mouseOverHandle = !$( event.target ).parents().addBack().is( ".ui-slider-handle" ); |
||
| 223 | this._clickOffset = mouseOverHandle ? { left: 0, top: 0 } : { |
||
| 224 | left: event.pageX - offset.left - ( closestHandle.width() / 2 ), |
||
| 225 | top: event.pageY - offset.top - |
||
| 226 | ( closestHandle.height() / 2 ) - |
||
| 227 | ( parseInt( closestHandle.css( "borderTopWidth" ), 10 ) || 0 ) - |
||
| 228 | ( parseInt( closestHandle.css( "borderBottomWidth" ), 10 ) || 0 ) + |
||
| 229 | ( parseInt( closestHandle.css( "marginTop" ), 10 ) || 0 ) |
||
| 230 | }; |
||
| 231 | |||
| 232 | if ( !this.handles.hasClass( "ui-state-hover" ) ) { |
||
| 233 | this._slide( event, index, normValue ); |
||
| 234 | } |
||
| 235 | this._animateOff = true; |
||
| 236 | return true; |
||
| 237 | }, |
||
| 238 | |||
| 239 | _mouseStart: function() { |
||
| 240 | return true; |
||
| 241 | }, |
||
| 242 | |||
| 243 | _mouseDrag: function( event ) { |
||
| 244 | var position = { x: event.pageX, y: event.pageY }, |
||
| 245 | normValue = this._normValueFromMouse( position ); |
||
| 246 | |||
| 247 | this._slide( event, this._handleIndex, normValue ); |
||
| 248 | |||
| 249 | return false; |
||
| 250 | }, |
||
| 251 | |||
| 252 | _mouseStop: function( event ) { |
||
| 253 | this._removeClass( this.handles, null, "ui-state-active" ); |
||
| 254 | this._mouseSliding = false; |
||
| 255 | |||
| 256 | this._stop( event, this._handleIndex ); |
||
| 257 | this._change( event, this._handleIndex ); |
||
| 258 | |||
| 259 | this._handleIndex = null; |
||
| 260 | this._clickOffset = null; |
||
| 261 | this._animateOff = false; |
||
| 262 | |||
| 263 | return false; |
||
| 264 | }, |
||
| 265 | |||
| 266 | _detectOrientation: function() { |
||
| 267 | this.orientation = ( this.options.orientation === "vertical" ) ? "vertical" : "horizontal"; |
||
| 268 | }, |
||
| 269 | |||
| 270 | _normValueFromMouse: function( position ) { |
||
| 271 | var pixelTotal, |
||
| 272 | pixelMouse, |
||
| 273 | percentMouse, |
||
| 274 | valueTotal, |
||
| 275 | valueMouse; |
||
| 276 | |||
| 277 | if ( this.orientation === "horizontal" ) { |
||
| 278 | pixelTotal = this.elementSize.width; |
||
| 279 | pixelMouse = position.x - this.elementOffset.left - |
||
| 280 | ( this._clickOffset ? this._clickOffset.left : 0 ); |
||
| 281 | } else { |
||
| 282 | pixelTotal = this.elementSize.height; |
||
| 283 | pixelMouse = position.y - this.elementOffset.top - |
||
| 284 | ( this._clickOffset ? this._clickOffset.top : 0 ); |
||
| 285 | } |
||
| 286 | |||
| 287 | percentMouse = ( pixelMouse / pixelTotal ); |
||
| 288 | if ( percentMouse > 1 ) { |
||
| 289 | percentMouse = 1; |
||
| 290 | } |
||
| 291 | if ( percentMouse < 0 ) { |
||
| 292 | percentMouse = 0; |
||
| 293 | } |
||
| 294 | if ( this.orientation === "vertical" ) { |
||
| 295 | percentMouse = 1 - percentMouse; |
||
| 296 | } |
||
| 297 | |||
| 298 | valueTotal = this._valueMax() - this._valueMin(); |
||
| 299 | valueMouse = this._valueMin() + percentMouse * valueTotal; |
||
| 300 | |||
| 301 | return this._trimAlignValue( valueMouse ); |
||
| 302 | }, |
||
| 303 | |||
| 304 | _uiHash: function( index, value, values ) { |
||
| 305 | var uiHash = { |
||
| 306 | handle: this.handles[ index ], |
||
| 307 | handleIndex: index, |
||
| 308 | value: value !== undefined ? value : this.value() |
||
| 309 | }; |
||
| 310 | |||
| 311 | if ( this._hasMultipleValues() ) { |
||
| 312 | uiHash.value = value !== undefined ? value : this.values( index ); |
||
| 313 | uiHash.values = values || this.values(); |
||
| 314 | } |
||
| 315 | |||
| 316 | return uiHash; |
||
| 317 | }, |
||
| 318 | |||
| 319 | _hasMultipleValues: function() { |
||
| 320 | return this.options.values && this.options.values.length; |
||
| 321 | }, |
||
| 322 | |||
| 323 | _start: function( event, index ) { |
||
| 324 | return this._trigger( "start", event, this._uiHash( index ) ); |
||
| 325 | }, |
||
| 326 | |||
| 327 | _slide: function( event, index, newVal ) { |
||
| 328 | var allowed, otherVal, |
||
| 329 | currentValue = this.value(), |
||
| 330 | newValues = this.values(); |
||
| 331 | |||
| 332 | if ( this._hasMultipleValues() ) { |
||
| 333 | otherVal = this.values( index ? 0 : 1 ); |
||
| 334 | currentValue = this.values( index ); |
||
| 335 | |||
| 336 | if ( this.options.values.length === 2 && this.options.range === true ) { |
||
| 337 | newVal = index === 0 ? Math.min( otherVal, newVal ) : Math.max( otherVal, newVal ); |
||
| 338 | } |
||
| 339 | |||
| 340 | newValues[ index ] = newVal; |
||
| 341 | } |
||
| 342 | |||
| 343 | if ( newVal === currentValue ) { |
||
| 344 | return; |
||
| 345 | } |
||
| 346 | |||
| 347 | allowed = this._trigger( "slide", event, this._uiHash( index, newVal, newValues ) ); |
||
| 348 | |||
| 349 | // A slide can be canceled by returning false from the slide callback |
||
| 350 | if ( allowed === false ) { |
||
| 351 | return; |
||
| 352 | } |
||
| 353 | |||
| 354 | if ( this._hasMultipleValues() ) { |
||
| 355 | this.values( index, newVal ); |
||
| 356 | } else { |
||
| 357 | this.value( newVal ); |
||
| 358 | } |
||
| 359 | }, |
||
| 360 | |||
| 361 | _stop: function( event, index ) { |
||
| 362 | this._trigger( "stop", event, this._uiHash( index ) ); |
||
| 363 | }, |
||
| 364 | |||
| 365 | _change: function( event, index ) { |
||
| 366 | if ( !this._keySliding && !this._mouseSliding ) { |
||
| 367 | |||
| 368 | //store the last changed value index for reference when handles overlap |
||
| 369 | this._lastChangedValue = index; |
||
| 370 | this._trigger( "change", event, this._uiHash( index ) ); |
||
| 371 | } |
||
| 372 | }, |
||
| 373 | |||
| 374 | value: function( newValue ) { |
||
| 375 | if ( arguments.length ) { |
||
| 376 | this.options.value = this._trimAlignValue( newValue ); |
||
| 377 | this._refreshValue(); |
||
| 378 | this._change( null, 0 ); |
||
| 379 | return; |
||
| 380 | } |
||
| 381 | |||
| 382 | return this._value(); |
||
| 383 | }, |
||
| 384 | |||
| 385 | values: function( index, newValue ) { |
||
| 386 | var vals, |
||
| 387 | newValues, |
||
| 388 | i; |
||
| 389 | |||
| 390 | if ( arguments.length > 1 ) { |
||
| 391 | this.options.values[ index ] = this._trimAlignValue( newValue ); |
||
| 392 | this._refreshValue(); |
||
| 393 | this._change( null, index ); |
||
| 394 | return; |
||
| 395 | } |
||
| 396 | |||
| 397 | if ( arguments.length ) { |
||
| 398 | if ( $.isArray( arguments[ 0 ] ) ) { |
||
| 399 | vals = this.options.values; |
||
| 400 | newValues = arguments[ 0 ]; |
||
| 401 | for ( i = 0; i < vals.length; i += 1 ) { |
||
| 402 | vals[ i ] = this._trimAlignValue( newValues[ i ] ); |
||
| 403 | this._change( null, i ); |
||
| 404 | } |
||
| 405 | this._refreshValue(); |
||
| 406 | } else { |
||
| 407 | if ( this._hasMultipleValues() ) { |
||
| 408 | return this._values( index ); |
||
| 409 | } else { |
||
| 410 | return this.value(); |
||
| 411 | } |
||
| 412 | } |
||
| 413 | } else { |
||
| 414 | return this._values(); |
||
| 415 | } |
||
| 416 | }, |
||
| 417 | |||
| 418 | _setOption: function( key, value ) { |
||
| 419 | var i, |
||
| 420 | valsLength = 0; |
||
| 421 | |||
| 422 | if ( key === "range" && this.options.range === true ) { |
||
| 423 | if ( value === "min" ) { |
||
| 424 | this.options.value = this._values( 0 ); |
||
| 425 | this.options.values = null; |
||
| 426 | } else if ( value === "max" ) { |
||
| 427 | this.options.value = this._values( this.options.values.length - 1 ); |
||
| 428 | this.options.values = null; |
||
| 429 | } |
||
| 430 | } |
||
| 431 | |||
| 432 | if ( $.isArray( this.options.values ) ) { |
||
| 433 | valsLength = this.options.values.length; |
||
| 434 | } |
||
| 435 | |||
| 436 | this._super( key, value ); |
||
| 437 | |||
| 438 | switch ( key ) { |
||
|
Coding Style
introduced
by
|
|||
| 439 | case "orientation": |
||
| 440 | this._detectOrientation(); |
||
| 441 | this._removeClass( "ui-slider-horizontal ui-slider-vertical" ) |
||
| 442 | ._addClass( "ui-slider-" + this.orientation ); |
||
| 443 | this._refreshValue(); |
||
| 444 | if ( this.options.range ) { |
||
| 445 | this._refreshRange( value ); |
||
| 446 | } |
||
| 447 | |||
| 448 | // Reset positioning from previous orientation |
||
| 449 | this.handles.css( value === "horizontal" ? "bottom" : "left", "" ); |
||
| 450 | break; |
||
| 451 | case "value": |
||
| 452 | this._animateOff = true; |
||
| 453 | this._refreshValue(); |
||
| 454 | this._change( null, 0 ); |
||
| 455 | this._animateOff = false; |
||
| 456 | break; |
||
| 457 | case "values": |
||
| 458 | this._animateOff = true; |
||
| 459 | this._refreshValue(); |
||
| 460 | |||
| 461 | // Start from the last handle to prevent unreachable handles (#9046) |
||
| 462 | for ( i = valsLength - 1; i >= 0; i-- ) { |
||
| 463 | this._change( null, i ); |
||
| 464 | } |
||
| 465 | this._animateOff = false; |
||
| 466 | break; |
||
| 467 | case "step": |
||
| 468 | case "min": |
||
| 469 | case "max": |
||
| 470 | this._animateOff = true; |
||
| 471 | this._calculateNewMax(); |
||
| 472 | this._refreshValue(); |
||
| 473 | this._animateOff = false; |
||
| 474 | break; |
||
| 475 | case "range": |
||
| 476 | this._animateOff = true; |
||
| 477 | this._refresh(); |
||
| 478 | this._animateOff = false; |
||
| 479 | break; |
||
| 480 | } |
||
| 481 | }, |
||
| 482 | |||
| 483 | _setOptionDisabled: function( value ) { |
||
| 484 | this._super( value ); |
||
| 485 | |||
| 486 | this._toggleClass( null, "ui-state-disabled", !!value ); |
||
| 487 | }, |
||
| 488 | |||
| 489 | //internal value getter |
||
| 490 | // _value() returns value trimmed by min and max, aligned by step |
||
| 491 | _value: function() { |
||
| 492 | var val = this.options.value; |
||
| 493 | val = this._trimAlignValue( val ); |
||
| 494 | |||
| 495 | return val; |
||
| 496 | }, |
||
| 497 | |||
| 498 | //internal values getter |
||
| 499 | // _values() returns array of values trimmed by min and max, aligned by step |
||
| 500 | // _values( index ) returns single value trimmed by min and max, aligned by step |
||
| 501 | _values: function( index ) { |
||
| 502 | var val, |
||
| 503 | vals, |
||
| 504 | i; |
||
| 505 | |||
| 506 | if ( arguments.length ) { |
||
| 507 | val = this.options.values[ index ]; |
||
| 508 | val = this._trimAlignValue( val ); |
||
| 509 | |||
| 510 | return val; |
||
| 511 | } else if ( this._hasMultipleValues() ) { |
||
| 512 | |||
| 513 | // .slice() creates a copy of the array |
||
| 514 | // this copy gets trimmed by min and max and then returned |
||
| 515 | vals = this.options.values.slice(); |
||
| 516 | for ( i = 0; i < vals.length; i += 1 ) { |
||
| 517 | vals[ i ] = this._trimAlignValue( vals[ i ] ); |
||
| 518 | } |
||
| 519 | |||
| 520 | return vals; |
||
| 521 | } else { |
||
| 522 | return []; |
||
| 523 | } |
||
| 524 | }, |
||
| 525 | |||
| 526 | // Returns the step-aligned value that val is closest to, between (inclusive) min and max |
||
| 527 | _trimAlignValue: function( val ) { |
||
| 528 | if ( val <= this._valueMin() ) { |
||
| 529 | return this._valueMin(); |
||
| 530 | } |
||
| 531 | if ( val >= this._valueMax() ) { |
||
| 532 | return this._valueMax(); |
||
| 533 | } |
||
| 534 | var step = ( this.options.step > 0 ) ? this.options.step : 1, |
||
| 535 | valModStep = ( val - this._valueMin() ) % step, |
||
| 536 | alignValue = val - valModStep; |
||
| 537 | |||
| 538 | if ( Math.abs( valModStep ) * 2 >= step ) { |
||
| 539 | alignValue += ( valModStep > 0 ) ? step : ( -step ); |
||
| 540 | } |
||
| 541 | |||
| 542 | // Since JavaScript has problems with large floats, round |
||
| 543 | // the final value to 5 digits after the decimal point (see #4124) |
||
| 544 | return parseFloat( alignValue.toFixed( 5 ) ); |
||
| 545 | }, |
||
| 546 | |||
| 547 | _calculateNewMax: function() { |
||
| 548 | var max = this.options.max, |
||
| 549 | min = this._valueMin(), |
||
| 550 | step = this.options.step, |
||
| 551 | aboveMin = Math.round( ( max - min ) / step ) * step; |
||
| 552 | max = aboveMin + min; |
||
| 553 | if ( max > this.options.max ) { |
||
| 554 | |||
| 555 | //If max is not divisible by step, rounding off may increase its value |
||
| 556 | max -= step; |
||
| 557 | } |
||
| 558 | this.max = parseFloat( max.toFixed( this._precision() ) ); |
||
| 559 | }, |
||
| 560 | |||
| 561 | _precision: function() { |
||
| 562 | var precision = this._precisionOf( this.options.step ); |
||
| 563 | if ( this.options.min !== null ) { |
||
| 564 | precision = Math.max( precision, this._precisionOf( this.options.min ) ); |
||
| 565 | } |
||
| 566 | return precision; |
||
| 567 | }, |
||
| 568 | |||
| 569 | _precisionOf: function( num ) { |
||
| 570 | var str = num.toString(), |
||
| 571 | decimal = str.indexOf( "." ); |
||
| 572 | return decimal === -1 ? 0 : str.length - decimal - 1; |
||
| 573 | }, |
||
| 574 | |||
| 575 | _valueMin: function() { |
||
| 576 | return this.options.min; |
||
| 577 | }, |
||
| 578 | |||
| 579 | _valueMax: function() { |
||
| 580 | return this.max; |
||
| 581 | }, |
||
| 582 | |||
| 583 | _refreshRange: function( orientation ) { |
||
| 584 | if ( orientation === "vertical" ) { |
||
| 585 | this.range.css( { "width": "", "left": "" } ); |
||
| 586 | } |
||
| 587 | if ( orientation === "horizontal" ) { |
||
| 588 | this.range.css( { "height": "", "bottom": "" } ); |
||
| 589 | } |
||
| 590 | }, |
||
| 591 | |||
| 592 | _refreshValue: function() { |
||
| 593 | var lastValPercent, valPercent, value, valueMin, valueMax, |
||
| 594 | oRange = this.options.range, |
||
| 595 | o = this.options, |
||
| 596 | that = this, |
||
| 597 | animate = ( !this._animateOff ) ? o.animate : false, |
||
| 598 | _set = {}; |
||
| 599 | |||
| 600 | if ( this._hasMultipleValues() ) { |
||
| 601 | this.handles.each( function( i ) { |
||
| 602 | valPercent = ( that.values( i ) - that._valueMin() ) / ( that._valueMax() - |
||
| 603 | that._valueMin() ) * 100; |
||
| 604 | _set[ that.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%"; |
||
| 605 | $( this ).stop( 1, 1 )[ animate ? "animate" : "css" ]( _set, o.animate ); |
||
| 606 | if ( that.options.range === true ) { |
||
| 607 | if ( that.orientation === "horizontal" ) { |
||
| 608 | if ( i === 0 ) { |
||
| 609 | that.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { |
||
| 610 | left: valPercent + "%" |
||
| 611 | }, o.animate ); |
||
| 612 | } |
||
| 613 | if ( i === 1 ) { |
||
| 614 | that.range[ animate ? "animate" : "css" ]( { |
||
| 615 | width: ( valPercent - lastValPercent ) + "%" |
||
| 616 | }, { |
||
| 617 | queue: false, |
||
| 618 | duration: o.animate |
||
| 619 | } ); |
||
| 620 | } |
||
| 621 | } else { |
||
| 622 | if ( i === 0 ) { |
||
| 623 | that.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { |
||
| 624 | bottom: ( valPercent ) + "%" |
||
| 625 | }, o.animate ); |
||
| 626 | } |
||
| 627 | if ( i === 1 ) { |
||
| 628 | that.range[ animate ? "animate" : "css" ]( { |
||
| 629 | height: ( valPercent - lastValPercent ) + "%" |
||
| 630 | }, { |
||
| 631 | queue: false, |
||
| 632 | duration: o.animate |
||
| 633 | } ); |
||
| 634 | } |
||
| 635 | } |
||
| 636 | } |
||
| 637 | lastValPercent = valPercent; |
||
| 638 | } ); |
||
| 639 | } else { |
||
| 640 | value = this.value(); |
||
| 641 | valueMin = this._valueMin(); |
||
| 642 | valueMax = this._valueMax(); |
||
| 643 | valPercent = ( valueMax !== valueMin ) ? |
||
| 644 | ( value - valueMin ) / ( valueMax - valueMin ) * 100 : |
||
| 645 | 0; |
||
| 646 | _set[ this.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%"; |
||
| 647 | this.handle.stop( 1, 1 )[ animate ? "animate" : "css" ]( _set, o.animate ); |
||
| 648 | |||
| 649 | if ( oRange === "min" && this.orientation === "horizontal" ) { |
||
| 650 | this.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { |
||
| 651 | width: valPercent + "%" |
||
| 652 | }, o.animate ); |
||
| 653 | } |
||
| 654 | if ( oRange === "max" && this.orientation === "horizontal" ) { |
||
| 655 | this.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { |
||
| 656 | width: ( 100 - valPercent ) + "%" |
||
| 657 | }, o.animate ); |
||
| 658 | } |
||
| 659 | if ( oRange === "min" && this.orientation === "vertical" ) { |
||
| 660 | this.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { |
||
| 661 | height: valPercent + "%" |
||
| 662 | }, o.animate ); |
||
| 663 | } |
||
| 664 | if ( oRange === "max" && this.orientation === "vertical" ) { |
||
| 665 | this.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { |
||
| 666 | height: ( 100 - valPercent ) + "%" |
||
| 667 | }, o.animate ); |
||
| 668 | } |
||
| 669 | } |
||
| 670 | }, |
||
| 671 | |||
| 672 | _handleEvents: { |
||
| 673 | keydown: function( event ) { |
||
| 674 | var allowed, curVal, newVal, step, |
||
| 675 | index = $( event.target ).data( "ui-slider-handle-index" ); |
||
| 676 | |||
| 677 | switch ( event.keyCode ) { |
||
| 678 | case $.ui.keyCode.HOME: |
||
| 679 | case $.ui.keyCode.END: |
||
| 680 | case $.ui.keyCode.PAGE_UP: |
||
| 681 | case $.ui.keyCode.PAGE_DOWN: |
||
| 682 | case $.ui.keyCode.UP: |
||
| 683 | case $.ui.keyCode.RIGHT: |
||
| 684 | case $.ui.keyCode.DOWN: |
||
| 685 | case $.ui.keyCode.LEFT: |
||
| 686 | event.preventDefault(); |
||
| 687 | if ( !this._keySliding ) { |
||
| 688 | this._keySliding = true; |
||
| 689 | this._addClass( $( event.target ), null, "ui-state-active" ); |
||
| 690 | allowed = this._start( event, index ); |
||
| 691 | if ( allowed === false ) { |
||
| 692 | return; |
||
| 693 | } |
||
| 694 | } |
||
| 695 | break; |
||
| 696 | } |
||
| 697 | |||
| 698 | step = this.options.step; |
||
| 699 | if ( this._hasMultipleValues() ) { |
||
| 700 | curVal = newVal = this.values( index ); |
||
| 701 | } else { |
||
| 702 | curVal = newVal = this.value(); |
||
| 703 | } |
||
| 704 | |||
| 705 | switch ( event.keyCode ) { |
||
| 706 | case $.ui.keyCode.HOME: |
||
| 707 | newVal = this._valueMin(); |
||
| 708 | break; |
||
| 709 | case $.ui.keyCode.END: |
||
| 710 | newVal = this._valueMax(); |
||
| 711 | break; |
||
| 712 | case $.ui.keyCode.PAGE_UP: |
||
| 713 | newVal = this._trimAlignValue( |
||
| 714 | curVal + ( ( this._valueMax() - this._valueMin() ) / this.numPages ) |
||
| 715 | ); |
||
| 716 | break; |
||
| 717 | case $.ui.keyCode.PAGE_DOWN: |
||
| 718 | newVal = this._trimAlignValue( |
||
| 719 | curVal - ( ( this._valueMax() - this._valueMin() ) / this.numPages ) ); |
||
| 720 | break; |
||
| 721 | case $.ui.keyCode.UP: |
||
| 722 | case $.ui.keyCode.RIGHT: |
||
| 723 | if ( curVal === this._valueMax() ) { |
||
| 724 | return; |
||
| 725 | } |
||
| 726 | newVal = this._trimAlignValue( curVal + step ); |
||
| 727 | break; |
||
| 728 | case $.ui.keyCode.DOWN: |
||
| 729 | case $.ui.keyCode.LEFT: |
||
| 730 | if ( curVal === this._valueMin() ) { |
||
| 731 | return; |
||
| 732 | } |
||
| 733 | newVal = this._trimAlignValue( curVal - step ); |
||
| 734 | break; |
||
| 735 | } |
||
| 736 | |||
| 737 | this._slide( event, index, newVal ); |
||
| 738 | }, |
||
| 739 | keyup: function( event ) { |
||
| 740 | var index = $( event.target ).data( "ui-slider-handle-index" ); |
||
| 741 | |||
| 742 | if ( this._keySliding ) { |
||
| 743 | this._keySliding = false; |
||
| 744 | this._stop( event, index ); |
||
| 745 | this._change( event, index ); |
||
| 746 | this._removeClass( $( event.target ), null, "ui-state-active" ); |
||
| 747 | } |
||
| 748 | } |
||
| 749 | } |
||
| 750 | } ); |
||
| 751 | |||
| 752 | } ) ); |
||
| 753 |
Loading history...